<template>
	<view class="login">

		<view class="h_one" style="font-size: 14px;margin-left: 40px;color: gray;">可提现金额: <text style="color: #F14399;">
				{{balance}}</text>元
		</view>
		<view class="login-main">
			<view class="login-list flex border-all">
				<view class="iconfont icon-account flex"></view>
				<view class="login-input">
					<input type="text" v-model="bal" maxlength="11" name="bal" placeholder="请输入提现金额"
						class="is-input1" />
				</view>
			</view>

			<view class="" style="margin-top: 20px;">
				<button style="background-color:#F14399;" type="primary" @click="submit">提交</button>
			</view>
		</view>

	</view>
</template>

<script>
	import uniStatusBar from '@/common/uni-status-bar/uni-status-bar.vue';

	export default {
		components: {
			uniStatusBar,
		},
		data() {
			return {
				status: false,
				bal: "",
				loading: false,
				balance:"",
			}
		},
		onLoad() {
            this.get_bal();
		},
		computed: {
			disabled() {
				if ((this.bal === '') && (this.bal === '')) {
					return true
				}
				return false
			}
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				});
			},

			// 初始化表单
			initForm() {
				this.username = ''
			},

			// 切换登录方式
			changeStatus() {
				// 初始化表单
				this.initForm()
				this.status = !this.status
			},
			
			//实时获取帐户余额
			async get_bal() {
				const launchFlag = uni.getStorageSync('my_ziliao');
				const res = await this.$myRuquest({
					url: '/index/api/get_bal',
					data: {
						"bal": this.bal,
						"uid": launchFlag.id,
					}
				})

				this.balance=res.data.bal
			},
			// 提交
			async submit() {
				
				const launchFlag = uni.getStorageSync('my_ziliao');
				
				if(this.bal<0 || this.bal==0){
					
					uni.showToast({
						title: "提现金额必须大于0",
						duration: 3000,
						icon: 'none'
					})
					return false;
				}
				
				const res = await this.$myRuquest({
					url: '/index/api/finance',
					data: {
						"bal": this.bal,
						"uid": launchFlag.id,
					}
				})

				if (res.data.code == 200) {
					
					this.initForm();
					uni.showToast({
						title: res.data.info,
						duration: 3000,
						icon: 'none'
					})

				} else {
					uni.showToast({
						title: res.data.info,
						duration: 3000,
						icon: 'none'
					})

				}


			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}

	.flex {
		display: flex;
	}

	.login {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
	}

	.login-main {
		flex: 1;
		padding: 0 70upx;

		.login-logo {
			width: 200upx;
			height: 200upx;
			padding-bottom: 50upx;
			margin: 50upx auto 0 auto;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.logo-tip {
			text-align: center;
			padding-top: 25upx;
			font-size: 32upx;
			font-weight: 200;
			color: rgba(51, 51, 51, 1);
			padding-bottom: 50upx;
		}

		.login-list {
			margin-top: 35upx;
			height: 100upx;
			align-items: center;
			padding: 0 30upx;
			border: 1px solid #E8E8E8;
			border-radius: 25px;

			&.border-all {
				&:after {
					border: 1px solid #D0D0D0;
					border-radius: 100upx;
				}
			}

			.iconfont {
				width: 65upx;
				font-size: 44upx;
				align-items: center;

				&:after {
					margin-left: 20upx;
					content: '';
					width: 2upx;
					height: 35upx;
					background: #D0D0D0;
					display: block;
				}
			}

			.login-input {
				flex: 1;

				input {
					font-size: 28upx;
					color: #333333;
					padding-left: 20upx;
				}
			}

			.code-sx {
				content: '';
				width: 2upx;
				height: 25upx;
				background: #D0D0D0;
				margin-right: 25upx;
			}

			.codeimg {
				font-size: 24upx;
				color: #999999;
			}
		}

		.login-btn {
			margin-top: 70upx;
			height: 96upx;
			width: 100%;
			background: linear-gradient(-90deg, rgba(80, 85, 168, 1), rgba(104, 110, 210, 1));
			border-radius: 47upx;
			font-size: 34upx;
			color: #ffffff;
		}
	}

	.buttom {
		display: flex;
		margin-top: 15px;
		margin-left: 20%;
		text-align: right;

		text {
			padding: 0 30px;
			color: #007AFF;
			font-size: 20px;
		}
	}
</style>
